<template>
<div class="status">

  <!---

  运单状态：

    INIT("INIT","初始化","Init"),
    WAIT_PACK("WAIT_PACK","待包装","Wait Package"),
    WAIT_CONFIRM("WAIT_CONFIRM","待确认","Wait Confirm"),
    WAIT_PAYMENT("WAIT_PAYMENT","待支付","Wait Payment"),
    WAIT_SHIPPING("WAIT_SHIPPING","待发货","Wait Shipping"),
    DELIVERED("DELIVERED","已发货","Delivered"),
    CANCELED("CANCELED","取消运单","Canceled"),
    COMPLETED("COMPLETED","已妥投","Completed")
    CONFIRMING("CONFIRMING","确认中","Confirming"),

  -->
  <div class="info" v-for="item in statusList" :key="item.status">
    <span v-if="item.status == dataInfo.status.toUpperCase()" class="text">{{$t(item.text)}}</span>
  </div>
</div>
</template>

<script>
export default {
  props: {
    dataInfo: Object
  },
  name: "packages-status",
  data() {
    return {
      statusList: [
        {
          status: 'INIT',
          text: 'user.waitingSubmit',
        },
        {
          status: 'WAIT_PACK',
          text: 'user.waitingPacking',
        },
        {
          status: 'WAIT_CONFIRM',
          text: 'user.waitConfirmation',
        },
        {
          status: 'WAIT_PAYMENT',
          text: 'user.waitPayment'
        },
        {
          status: 'WAIT_SENT_OVERSEA',
          text: 'user.awaitSendOverseas'
        },
        {
          status: 'WAIT_SHIPPING',
          text: 'user.waitDelivery'
        },
        {
          status: 'DELIVERED',
          text: 'user.shipped'
        },
        {
          status: 'SHIPPED',
          text: 'user.shipped'
        },
        {
          status: 'CANCELED',
          text: 'user.cancellationWaybill'
        },
        {
          status: 'RECEIVED',
          text: 'user.delivered' // 重要：仓库需要验货、拍照。列表过滤
        },
        {
          status: 'COMPLETED',
          text: 'user.delivered' // 重要：仓库需要验货、拍照。列表过滤
        },
        {
          status: 'CANCELLED',
          text: 'user.cancelled' // 已取消
        },
        {
          status: 'CONFIRMING',
          text: 'user.confirming' // 确定中
        },
        {
          status: 'REFUNDED',
          text: 'user.returned' // 已退回
        }
      ]
    }
  }
}
</script>

<style scoped lang="less">
.status {
  display: flex;
  align-items: center;
  .text {
    font-weight: 600;
  }
  .icon {
    cursor: pointer;
  }
}
</style>